<template>
    <div class="container">
       
        <Category title="游戏">
          <template scope="game">
            <ul>
              <li v-for="(g,index) in game.games" :key="index">{{g}}</li>
            </ul> 
          </template>
          
        </Category>
      
        <Category title="游戏">
          <template scope="game">
            <ol>
              <li style="color:red" v-for="(g,index) in game.games" :key="index">{{g}}</li>
            </ol> 
          </template>
          
        </Category>

              
        <Category title="游戏">
          <template scope="{games}">
              <h4 v-for="(g,index) in games" :key="index">{{g}}</h4>
          </template>
          
        </Category>

    </div>
</template>

<script>
  import Category from './components/Category.vue'

  export default {
    components: { Category },
    name:'App',
    
  }
</script>
<style scoped>
    .container,.foot{
      display: flex;
      /* 主轴对对齐 */
      justify-content: space-around;
    }
    h4{
      text-align: center;
    }
    video{
      width: 100%;
    }
    img{
      width: 100%;
    }
</style>